{% extends "base.html" %}
{% load	bootstrap3 %}
{% load i18n %}
{% load static %}

{% block  title %}{% trans 'Upload Files Logs' %}{% endblock %}

{% block page-content %}
    <div class="row wrapper border-bottom white-bg page-heading">
        <div class="col-lg-10">
            <h2>{% trans 'Upload Files Logs' %}</h2>
            <ol class="breadcrumb">
                <li>
                     <a href="/">{% trans 'Home' %}</a>
                </li>
                <li>
                     <a href="{% url 'audit:login-log-list' %}">{% trans 'Audits' %}</a>
                </li>
                <li class="active">
                    <strong>{% trans 'Upload Files Logs' %}</strong>
                </li>
            </ol>
        </div>
        <div class="col-lg-2">

        </div>
    </div>
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">

            <div class="col-lg-6" id="split-right">

                <div class="ibox float-e-margins">

                    <div class="ibox-title">
                        <h5>{% trans 'Upload Files Logs' %}</h5>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                <i class="fa fa-wrench"></i>
                            </a>
                            <ul class="dropdown-menu dropdown-user">
                                <li><a href="#" >{% trans 'Config Option 1' %}</a>
                                </li>
                                <li><a href="#" >{% trans 'Config Option 2' %}</a>
                                </li>
                            </ul>
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>
                    <div class="ibox-content">

                        <div class="table-responsive">

                            <div id="del_form_asset_all" class="form-horizontal" >
                                {% csrf_token %}

                                <table class="table table-striped table-bordered table-hover dataTables-assets">
                                    <thead>
                                    <tr>
                                        <th class="text-center">{% trans 'Project Name' %}</th>
                                        <th class="text-center">{% trans 'IP' %}</th>
                                        <th class="text-center">{% trans 'Path' %}</th>
                                        <th class="text-center">{% trans 'Status' %}</th>
                                        <th class="text-center">{% trans 'Start Tasks Time' %}</th>
                                        <th class="text-center">{% trans 'Time Consuming' %}</th>
                                        <th class="text-center">{% trans 'Operator' %}</th>
                                    </tr>
                                    </thead>

                                </table>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-lg-6" id="split-right">

                <div class="ibox float-e-margins">

                    <div class="ibox-title">
                        <h5>{% trans 'Upload Files Logs' %}</h5>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                <i class="fa fa-wrench"></i>
                            </a>
                            <ul class="dropdown-menu dropdown-user">
                                <li><a href="#" >{% trans 'Config Option 1' %}</a>
                                </li>
                                <li><a href="#" >{% trans 'Config Option 2' %}</a>
                                </li>
                            </ul>
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>
                    <div class="ibox-content  pres">

                        <pre> <span id="err"></span></pre>

                    </div>
                </div>
            </div>
        </div>
    </div>




{% endblock %}
{% block footer-js %}

    <script src="{% static 'js/plugins/dataTables/datatables.min.js' %}"></script>
    <script>

    $(document).ready(function(){
        createTable();
    });

    var tables;

    function reloadTable(){
        tables.fnDestroy();
        createTable();
    }

    timer = setInterval("reloadTable()",2000);

    function  stopUpdate() {
        clearInterval(timer);
    }
    function createTable(){
        tables = $('.dataTables-assets').dataTable({
            bProcessing: true, // 是否显示取数据时的那个等待提示
            bServerSide: false,//这个用来指明是通过服务端来取数据
            sAjaxSource: "{% url 'audit:jobs_crontab_result' %}",
            fnServerData: retrieveData || [],
            //pageLength: 25,
            bInfo: false,
            responsive: true,
            columnDefs : [ { targets : 0, "orderable" : false } ], "order" : [ [ 1, 'asc' ] ] ,
            dom: '<"html5buttons"B>lTfgitp',
            buttons: [],
            columns: [
                { "data": "project" },
                { "data": "ip" },
                { "data": "cmd" },
                { "data": "status" },
                { "data": "start_time" },
                { "data": "total_time" },
                { "data": "operator" }
            ]

        }).off("click").on("click", function(event) {
            var TaskScheduleID = ($(event.target).closest("tr").attr("id"));
            get_data(TaskScheduleID);

        });
    }

    function retrieveData( sSource111,aoData111, fnCallback111) {
        $.ajax({
            headers: {"X-CSRFToken": '{{ csrf_token }}'},
            url : sSource111,//这个就是请求地址对应sAjaxSource
            data : {"id": "{{ get_id }}" },//这个是把datatable的一些基本数据传给后台,比如起始位置,每页显示的行数
            type : 'post',
            dataType : 'json',
            async : false,
            success : function(data) {
                cons = "";
                fnCallback111(data);//把返回的数据传给这个方法就可以了,datatable会自动绑定数据的
                 if(data.flag){
                    stopUpdate();
                }
                if (data.res) {
                    $.each(data.res, function (i, values) {
                        if(values.result==''){
                            cons += "<pre>" + "{% trans 'IP' %}:"+ values.ip + "\n" +"{% trans 'Log Information' %}:" + values.log + "\n" + "{% trans 'Return Result' %}: \n" + "{% trans 'Please Wait While in Progress ...' %}" + "</pre>"
                        }else {
                            cons += "<pre>" + "{% trans 'IP' %}:"+ values.ip + "\n" +"{% trans 'Log Information' %}:" + values.log + "\n" + "{% trans 'Return Result' %}: \n" + values.result + "</pre>"
                        }

                        });
                    $(".pres").html(cons);
                }else {
                    $('#err').text(data.error);
                }
            },
        });
    }
    function get_data (TaskScheduleID){
        $.ajax({
            type: "POST",
            dataType:"json",
            url: "{% url 'audit:jobs_files_result' %}",
            data: {"id":'{{ get_id }}',"task_id":TaskScheduleID},
            success: function (data) {
                conss = "";
                if (data.res) {
                    $.each(data.res, function (i, values) {
                            conss += "<pre>" + "{% trans 'IP' %}:"+ values.ip + "\n" +"{% trans 'Log Information' %}:" + values.log + "\n" + "{% trans 'Return Result' %}: \n" + values.result + "</pre>"
                        });
                    $(".pres").find('pre').remove();
                    $(".pres").html(conss);
                }else {
                    $('#err').text(data.error);
                }
            }
        })
    }

    </script>

    {% endblock %}